<!DOCTYPE html>
<html lang="zh" xmlns:th="http://www.thymeleaf.org">
<head>
    <meta charset="UTF-8">
    <title>首页</title>
    <meta name="context-path" th:content="@{/}"/>
    <link rel="stylesheet" th:href="@{/resources/matrix/css/bootstrap.min.css}"/>
    <link rel="stylesheet" th:href="@{/resources/matrix/css/bootstrap-responsive.min.css}"/>
    <link rel="stylesheet" th:href="@{/resources/matrix/css/matrix-style.css}"/>
    <link rel="stylesheet" th:href="@{/resources/matrix/css/matrix-media.css}"/>
    <link rel="stylesheet" th:href="@{/resources/matrix/css/matrix-full.css}"/>
    <link rel="stylesheet" th:href="@{/resources/matrix/font-awesome/css/font-awesome.css}"/>
    <link rel="stylesheet" th:href="@{/resources/layui/css/layui.css}" media="all">
    <link rel="stylesheet" th:href="@{/resources/zTree_v3/css/zTreeStyle/zTreeStyle.css}" type="text/css">
    <link rel="stylesheet" th:href="@{/resources/css/website.css}"/>
    <link rel="stylesheet" th:href="@{/resources/css/tree.css}"/>
</head>
<body class="treebody">
<div class="carousel">
    <div class="layui-carousel" id="carousel">
        <div carousel-item>
            <div th:if="${entity.image1 != null and entity.image1 != ''}"><img
                    th:src="|${downloadUrl}?filename=${entity.image1}|" style="width:100%;height:100%;" alt=""></div>
            <div th:if="${entity.image2 != null and entity.image1 != ''}"><img
                    th:src="|${downloadUrl}?filename=${entity.image2}|" style="width:100%;height:100%;" alt=""></div>
            <div th:if="${entity.image3 != null and entity.image1 != ''}"><img
                    th:src="|${downloadUrl}?filename=${entity.image3}|" style="width:100%;height:100%;" alt=""></div>
            <div th:if="${entity.image4 != null and entity.image1 != ''}"><img
                    th:src="|${downloadUrl}?filename=${entity.image4}|" style="width:100%;height:100%;" alt=""></div>
        </div>
    </div>
</div>
<div class="alarm-table">
    <table class="layui-hide" id="alarm_grid"></table>
</div>
<script type="text/html" id="alarmbar">
    <a class="layui-btn layui-btn-xs" lay-event="edit">清除报警</a>
</script>
<script th:src="@{/resources/js/jquery.min.js}"></script>
<script th:src="@{/resources/js/jquery-migrate-1.2.1.js}"></script>
<script th:src="@{/resources/matrix/js/jquery.ui.custom.js}"></script>
<script th:src="@{/resources/matrix/js/bootstrap.min.js}"></script>
<script th:src="@{/resources/matrix/js/bootstrap-colorpicker.js}"></script>
<script th:src="@{/resources/matrix/js/bootstrap-datepicker.js}"></script>
<script th:src="@{/resources/matrix/js/masked.js}"></script>
<script th:src="@{/resources/matrix/js/jquery.uniform.js}"></script>
<script th:src="@{/resources/matrix/js/select2.min.js}"></script>
<script th:src="@{/resources/matrix/js/matrix.js}"></script>
<script th:src="@{/resources/matrix/js/jquery.peity.min.js}"></script>
<script th:src="@{/resources/layui/layui.all.js}" charset="utf-8"></script>
<script th:src="@{/resources/zTree_v3/js/jquery.ztree.core.js}"></script>
<script th:src="@{/resources/valid/js/bootstrapValidator.js}"></script>
<script th:src="@{/resources/valid/js/language/zh_CN.js}"></script>
<script th:src="@{/resources/js/website.js}"></script>
<script th:src="@{/resources/js/system.js}"></script>
<script th:src="@{/resources/js/validation_fields.js}"></script>
<script th:src="@{/resources/js/monitor/monitor_tree.js}"></script>
<script th:inline="javascript">
    /*<![CDATA[*/
    var contextRoot = $("meta[name='context-path']").attr("content");

    layui.use(['carousel', 'form', 'layer', 'table'], function () {
        var carousel = layui.carousel;
        var table = layui.table;
        //建造实例
        carousel.render({
            elem: '#carousel'
            , width: '100%' //设置容器宽度
            , height: '100%'
            , arrow: 'always' //始终显示箭头
            //,anim: 'updown' //切换动画方式
        });

        table.render({
            elem: '#alarm_grid'
            , id: 'alarm_grid'
            , height: 300
            , cols: [
                [
                    {field: 'name', title: '测点名称', sort: true},
                    {field: 'code', width: '20%', title: '编码', sort: true},
                    {field: 'unit', width: '15%', title: '单位', sort: true},
                    {field: 'warning1', width: '20%', title: '报警状态', sort: true},
                    {fixed: 'right', width: '15%', align: 'left', toolbar: '#alarmbar'}
                ]
            ]
            , size: 'sm'
            , data: []
            , even: true
        });
    });
</script>
</body>
</html>